<template>
  <div class="call-center">
    <base-header title="万联城服集团数据可视化平台（客户服务）" :rightIcon=true :leftIcon=true @goReload="goReload"></base-header>
    <div class="call-center__content">
      <div class="call-center__left">
        <div class="bg m10">
          <div class="back-border h100">
            <base-title title="工单统计"></base-title>
            <statistics-detail></statistics-detail>
          </div>
        </div>
        <div class="bg m10">
          <div class="back-border h100">
            <base-title title="工单来源"></base-title>
            <source-detail></source-detail>
          </div>
        </div>
        <div class="xj bg m10">
          <div class="back-border h100">
            <base-title title="设备巡检"></base-title>
            <EquipmentDetail></EquipmentDetail>
          </div>
        </div>
      </div>
      <div class="call-center__center">
        <div class="bg m10">
          <div class="back-border h100">
            <base-title title="工单汇总"></base-title>
            <summary-detail></summary-detail>
          </div>
        </div>
        <div class="xj bg m10">
          <div class="back-border h100">
            <base-title title="工单"></base-title>
            <order-detail></order-detail>
          </div>
        </div>
      </div>
      <div class="call-center__right">
        <div class="bg m10">
          <div class="back-border h100">
            <base-title title="秩序服务"></base-title>
            <clean-detail service="ba"></clean-detail>
          </div>
        </div>
        <div class="bg m10">
          <div class="back-border h100">
            <base-title title="保洁服务"></base-title>
            <clean-detail service="bj"></clean-detail>
          </div>
        </div>
      
        <div class="myd bg m10">
          <div class="back-border h100">
            <base-title title="客户满意度"></base-title>
            <satisfaction-detail></satisfaction-detail>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import BaseHeader from 'src/components/BaseHeader'
import BaseTitle from 'src/components/BaseTitle'
import StatisticsDetail from 'src/components/StatisticsDetail'
import SourceDetail from 'src/components/SourceDetail'
import SummaryDetail from 'src/components/SummaryDetail'
import EquipmentDetail from 'src/components/EquipmentDetail'
import OrderDetail from 'src/components/OrderDetail'
import SatisfactionDetail from 'src/components/SatisfactionDetail'
import CleanDetail from 'src/components/CleanDetail'

export default {
  components: {
    BaseTitle,
    BaseHeader,
    StatisticsDetail,
    SourceDetail,
    SummaryDetail,
    EquipmentDetail,
    OrderDetail,
    SatisfactionDetail,
    CleanDetail,
  },
  data() {
    return {
      
    }
  },
  methods: {
    goReload() {
      this.$router.push('/reloadback')
    }
  }
}
</script>
<style lang="scss">
.call-center {
  &__content {
    display: flex;
    width: 100%;
  }
  &__left {
    width: 25%;
  }
  &__center {
    width: 50%;
  }
  &__right {
    width: 25%;
  }
}
</style>